<!DOCTYPE HTML>
<html xmlns:th="www.thymeleaf.org">
<head>
<title>尤洪后台管理</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="keywords" content="Novus Admin Panel Responsive web template, Bootstrap Web Templates, Flat Web Templates, Android Compatible web template, 
SmartPhone Compatible web template, free WebDesigns for Nokia, Samsung, LG, SonyEricsson, Motorola web design" />
<script type="application/x-javascript"> addEventListener("load", function() { setTimeout(hideURLbar, 0); }, false); function hideURLbar(){ window.scrollTo(0,1); } </script>
<!-- Bootstrap Core CSS -->
<link href="css/bootstrap.css" rel='stylesheet' type='text/css' />
<!-- Custom CSS -->
<link href="css/style.css" rel='stylesheet' type='text/css' />
<!-- font CSS -->
<!-- font-awesome icons -->
<link href="css/font-awesome.css" rel="stylesheet"> 
<!-- //font-awesome icons -->
 <!-- js-->
<script src="js/jquery-1.11.1.min.js"></script>
<script src="js/modernizr.custom.js"></script>
<!--webfonts-->
<link href='http://fonts.useso.com/css?family=Roboto+Condensed:400,300,300italic,400italic,700,700italic' rel='stylesheet' type='text/css'>
<!--//webfonts--> 
<!--animate-->
<link href="css/animate.css" rel="stylesheet" type="text/css" media="all">
<script src="js/wow.min.js"></script>
	<script>
		 new WOW().init();
	</script>
<!--//end-animate-->
<!-- chart -->
<script src="js/Chart.js"></script>
<!-- //chart -->
<!--Calender-->
<link rel="stylesheet" href="css/clndr.css" type="text/css" />
<script src="js/underscore-min.js" type="text/javascript"></script>
<script src= "js/moment-2.2.1.js" type="text/javascript"></script>
<script src="js/clndr.js" type="text/javascript"></script>
<script src="js/site.js" type="text/javascript"></script>
<!--End Calender-->
<!-- Metis Menu -->
<script src="js/metisMenu.min.js"></script>
<script src="js/custom.js"></script>
<link href="css/custom.css" rel="stylesheet">
<!--//Metis Menu -->
</head> 
<body class="cbp-spmenu-push">
	<div class="main-content">
		<!--left-fixed -navigation-->
		<div class=" sidebar" role="navigation">
            <div class="navbar-collapse">
				<nav class="cbp-spmenu cbp-spmenu-vertical cbp-spmenu-left" id="cbp-spmenu-s1">
					<ul class="nav" id="side-menu">
						<li>
							<a href="index.html" class="active"><i class="fa fa-home nav_icon"></i>首页</a>
						</li>
						<!-- 商家 -->
						<li>
							<a href="#"><i class="fa fa-cogs nav_icon"></i>商品管理 <span class="fa arrow"></span></a>
							<ul class="nav nav-second-level collapse">
								<li>
									<a href="grids.html">添加商品</a>
								</li>
								<li>
									<a href="media.html">查看商品</a>
								</li>
							</ul>
							<!-- /nav-second-level -->
						</li>
						<li>
							<a href="#"><i class="fa fa-cogs nav_icon"></i>订单管理  <span class="fa arrow"></span></a>
							<ul class="nav nav-second-level collapse">
								<li>
									<a href="media.html">查看订单</a>
								</li>
							</ul>
							<!-- /nav-second-level -->
						</li>
						<!-- 此功能商家/管理员都有 -->
						<li>
							<a href="#"><i class="fa fa-bar-chart nav_icon"></i>财务报表 </a>
						</li>
						<li>
							<!-- 商家专属 -->
							<a href="#">
								<i class="fa fa-envelope nav_icon"></i>网站公告  
								<!-- 8 代表着有 8 个公告 -->
								<span class="nav-badge-btm">8</span>
							</a>
						</li><!-- //商家 -->
						
						<!-- 管理员 -->
						<li>
							<a href="#"><i class="fa fa-cogs nav_icon"></i>分类管理  <span class="fa arrow"></span></a>
							<ul class="nav nav-second-level collapse">
								<li>
									<a href="media.html">添加分类</a>
									<a href="media.html">查看分类</a>
								</li>
							</ul>
							<!-- /nav-second-level -->
						</li>
						<li>
							<!-- 若违规，封禁后，向商家发送通知邮件让商家修改或下架此商品 -->
							<a href="#"><i class="fa fa-bar-chart nav_icon"></i>商品管理 </a>
						</li>
						<li>
							<!-- 查看/审核/封禁商家 -->
							<a href="#"><i class="fa fa-bar-chart nav_icon"></i>商家管理 </a>
						</li>
						<li>
							<!-- 查看/封禁会员 -->
							<a href="#"><i class="fa fa-bar-chart nav_icon"></i>会员管理 </a>
						</li>
						<li>
							<a href="#"><i class="fa fa-cogs nav_icon"></i>管理员管理  <span class="fa arrow"></span></a>
							<ul class="nav nav-second-level collapse">
								<li>
									<a href="media.html">添加管理员</a>
									<a href="media.html">查看管理员</a>
								</li>
							</ul>
							<!-- /nav-second-level -->
						</li>
						<li>
							<!-- 管理员专属 -->
							<a href="#"><i class="fa fa-cogs nav_icon"></i>网站公告  <span class="fa arrow"></span></a>
							<ul class="nav nav-second-level collapse">
								<li>
									<a href="media.html">新增公告</a>
									<a href="media.html">查看公告</a>
								</li>
							</ul>
							<!-- /nav-second-level -->
						</li>
						
						<!-- //管理员 -->
					</ul>
					<!-- //sidebar-collapse -->
				</nav>
			</div>
		</div>
		<!--left-fixed -navigation-->
		<!-- header-starts -->
		<div class="sticky-header header-section ">
			<div class="header-left">
				<!--toggle button start-->
				<button id="showLeftPush"><i class="fa fa-bars"></i></button>
				<!--toggle button end-->
				<!--logo -->
				<div class="logo">
					<a href="index.html">
						<h1>尤洪商城</h1>
						<span>后 台 管 理</span>
					</a>
				</div>
				<!--//logo-->
				<!--search-box-->
				<div class="search-box">
					<form class="input">
						<input class="sb-search-input input__field--madoka" placeholder="查找..." type="search" id="input-31" />
						<label class="input__label" for="input-31">
							<svg class="graphic" width="100%" height="100%" viewBox="0 0 404 77" preserveAspectRatio="none">
								<path d="m0,0l404,0l0,77l-404,0l0,-77z"/>
							</svg>
						</label>
					</form>
				</div><!--//end-search-box-->
				<div class="clearfix"> </div>
			</div>
			<div class="header-right">
				<div class="profile_details_left"><!--notifications of menu start -->
					<ul class="nofitications-dropdown">
						<li class="dropdown head-dpdn">
							<a href="#" class="dropdown-toggle" data-toggle="dropdown" aria-expanded="false">
							<i class="fa fa-envelope"></i>
							<span class="badge">3</span></a><!-- 未读数量 -->
							<ul class="dropdown-menu">
								<li>
									<div class="notification_header">
										<h3>你有3封未读邮件...</h3>
									</div>
								</li>
								<li><a href="#">
								   <div class="user_img"><img src="images/1.png" alt=""></div>
								   <div class="notification_desc">
									<p>管理解决下我的问题</p>
									<p><span>1 小时前</span></p>
									</div>
								   <div class="clearfix"></div>	
								</a></li>
								<li class="odd"><a href="#">
									<div class="user_img"><img src="images/2.png" alt=""></div>
								   <div class="notification_desc">
									<p>管理解决下我的问题</p>
									<p><span>1 小时前</span></p>
									</div>
								  <div class="clearfix"></div>	
								</a></li>
								<li><a href="#">
								   <div class="user_img"><img src="images/3.png" alt=""></div>
								   <div class="notification_desc">
									<p>管理解决下我的问题</p>
									<p><span>1 小时前</span></p>
									</div>
								   <div class="clearfix"></div>	
								</a></li>
								<li>
									<div class="notification_bottom">
										<a href="#">查看更多邮件...</a>
									</div> 
								</li>
							</ul>
						</li>
						<li class="dropdown head-dpdn">
							<a href="#" class="dropdown-toggle" data-toggle="dropdown" aria-expanded="false">
							<i class="fa fa-bell"></i>
							<span class="badge blue">3</span></a><!-- 未读数量 -->
							<ul class="dropdown-menu">
								<li>
									<div class="notification_header">
										<h3>你有3个未读通知.../h3>
									</div>
								</li>
								<li><a href="#">
									<div class="user_img"><img src="images/2.png" alt=""></div>
								   <div class="notification_desc">
									<p>这个东西我们要这么做...</p>
									<p><span>1 小时前</span></p>
									</div>
								  <div class="clearfix"></div>	
								 </a></li>
								 <li class="odd"><a href="#">
									<div class="user_img"><img src="images/1.png" alt=""></div>
								   <div class="notification_desc">
									<p>这个东西我们要这么做...</p>
									<p><span>1 小时前</span></p>
									</div>
								   <div class="clearfix"></div>	
								 </a></li>
								 <li><a href="#">
									<div class="user_img"><img src="images/3.png" alt=""></div>
								   <div class="notification_desc">
									<p>这个东西我们要这么做...</p>
									<p><span>1 小时前</span></p>
									</div>
								   <div class="clearfix"></div>	
								 </a></li>
								 <li>
									<div class="notification_bottom">
										<a href="#">查看更多通知...</a>
									</div> 
								</li>
							</ul>
						</li>
						<!-- 如果登录用户是商家则显示 -->
						<li class="dropdown head-dpdn">
							<a href="#" class="dropdown-toggle" data-toggle="dropdown" aria-expanded="false">
							<i class="fa fa-tasks"></i>
							<span class="badge blue1">8</span></a><!-- 未读数量 -->
							<ul class="dropdown-menu">
								<li>
									<div class="notification_header">
										<h3>你有8个订单待处理...</h3>
									</div>
								</li>
								<li><a href="#">
									<div class="task-info">
										<span class="task-desc">Database update</span><span class="percentage">40%</span>
										<div class="clearfix"></div>	
									</div>
									<div class="progress progress-striped active">
										<div class="bar yellow" style="width:40%;"></div>
									</div>
								</a></li>
							</ul>
						</li>	
					</ul>
					<div class="clearfix"> </div>
				</div>
				<!--notification menu end -->
				<div class="profile_details">		
					<ul>
						<li class="dropdown profile_details_drop">
							<a href="#" class="dropdown-toggle" data-toggle="dropdown" aria-expanded="false">
								<div class="profile_img">	
									<span class="prfil-img"><img src="images/a.png" alt=""> </span> 
									<div class="user-name">
										<p>小张</p>
										<span>管理员</span><!-- 管理员或商家 -->
									</div>
									<i class="fa fa-angle-down lnr"></i>
									<i class="fa fa-angle-up lnr"></i>
									<div class="clearfix"></div>	
								</div>	
							</a>
							<ul class="dropdown-menu drp-mnu">
								<!--<li> <a href="#"><i class="fa fa-cog"></i> 设置</a> </li>--><!-- 设置 --> 
								<li> <a href="#"><i class="fa fa-user"></i> 个人信息</a> </li> 
								<li> <a href="#"><i class="fa fa-sign-out"></i> 登出</a> </li>
							</ul>
						</li>
					</ul>
				</div>
				<div class="clearfix"> </div>				
			</div>
			<div class="clearfix"> </div>	
		</div>
		<!-- //header-ends -->
		<!-- main content start-->
		<div id="page-wrapper">
			<div class="main-page" th:fragment="userFind">
				<div class="tables">
					<div class="bs-example widget-shadow" data-example-id="hoverable-table"> 
						<h4 style="display: inline-block;">用户列表:</h4>
						<!-- 条件查询 -->
						<form id="userFindForm" action="userFind.do" method="post">
							<input type="text" style="margin-left: 2%;" placeholder="用户名" id="findUserName" name="trueName"/>
							<select class="input-sm" style="font-size: 13px;margin-left: 2%;" name="state" id="findUserState">
								<option value="0">未选择</option>
								<option value="3">正常</option>
								<option value="1">已被封禁</option>
								<option value="2">正在审核</option>
							</select>&nbsp;&nbsp;&nbsp;
							<button class="label label-info" style="font-size: large;" >查询</button>
						</form>
						<script type="text/javascript">
						   var userName;
						   var userState;
						   
						   function toPage(page){
								$("#userShowTable").load("userShowToPage.do", {trueName: userName,state:userState,page:page}, function(){});
							}
							
							$(function(){
								$("#userFindForm").submit(function(){     // 提交表单的id
									var trueName = $('#findUserName').val();
									var state = $('#findUserState').val();
									userName=trueName;
									userState=state;
									$("#userShowTable").load("userFind.do", {trueName: trueName,state:state}, function(){});
							        return false;   //防止表单自动提交
							    });
							});
						</script>
							<!-- //条件查询 -->
							<div id="userShowTable" th:fragment="userShowTable">
							<table class="table table-hover">
								<thead>
									<tr>
										<th>#</th>
										<th>用户名</th>
										<th>性别</th>
										<th>电话</th>
										<th>邮箱</th>
										<th>注册时间</th>
										<th>状态</th>
										<th>操作</th><!-- 点击查看详情，跳转到product-add.html页面，填充所有的数据 -->
									</tr> 
								</thead> 
								<tbody> 
									<tr th:each="ulist,uStat:${userList}"> 
										<th scope="row" th:text="${uStat.count}">1</th>
										<td th:text="${ulist.trueName}">张三</td>
										<td>
										   <span th:if=${ulist.sex==0}>女</span>
										   <span th:if=${ulist.sex==1}>男</span>
										   <span th:if=${ulist.sex==2}>未知</span>
										</td>
										<td th:text="${ulist.tel.substring(0,3)}+'****'+${ulist.tel.substring(7,11)}"></td>
										<td th:text="${ulist.email.substring(0,3)}+'***'+${ulist.email.substring(6)}"></td>
										<td th:text="${ulist.registerTime.toLocalDateTime().getYear()}+'-'+${ulist.registerTime.toLocalDateTime().getMonthValue()}+'-'+${ulist.registerTime.toLocalDateTime().getDayOfMonth()}">2020-2-22 22:22</td>
										<td>
										   <label class="label label-danger" th:if=${ulist.state==1} th:id="'showUserStateLabel'+${ulist.id}">已被封禁</label>
										   <label class="label label-warning" th:if=${ulist.state==2} th:id="'showUserStateLabel'+${ulist.id}">申诉中</label>
										   <label class="label label-success" th:if=${ulist.state==3} th:id="'showUserStateLabel'+${ulist.id}">正常</label>
										  </td>
										<td><button type="button" class="btn btn-primary btn-lg"  th:id="'backUser'+${ulist.id}" th:onclick="'showUserDetails('+${ulist.id}+')'" data-toggle="modal" data-target="#gridSystemModal" style="padding: 6px;font-size: 11px;">查看详情 </button></td>
									</tr> 
								</tbody> 
							</table>
							<script type="text/javascript" th:inline="javascript">
							     function showUserDetails(user){
							    	 $.post('toShowUserDetils.do',{id:user},function(data){
							    		var str='<div style="margin-left: 3%;">'
										        +'<img style="width: 158px; height: 94px;" src="../'+data.image3.url+'" />'
											    +'<h4 style="display: inline-block;margin-left: 2%;" class="hdg" >'+data.trueName+'</h4> ';
							    		if(data.state==3){
											str+='<label class="label label-success" style="margin-left: 10px;">正常</label>';
										}else if(data.state==2){
											str+='<label class="label label-warning" style="margin-left: 10px;">正在审核诉讼</label>';
										}else if(data.state==1){
											str+='<label class="label label-danger" style="margin-left: 10px;">已被封禁</label>';
										}
							    		str+='</div><div style="margin-left: 3%;margin-top: 2%;" >'
										     +'<div id="addr-list" style="margin-bottom: 1%;">'
											 +'<label class="col-sm-2 control-label" style="width: 17.6%;" >用户地址</label>'
											 +'<div id="addr-list1">'
											 +'<span class="addr-num">1</span>'
											 +'<input type="text" style="width: 55%;" value="'+data.address2.name+'" placeholder="用户地址" disabled />'
											 +'</div></div>'
										     +'<a class="label label-info" id="addr-save" style="font-size: large;margin-left: 30%;display: none;" href="javascript:void(0)" onclick="saveAddr()">保存</a>'
									         +'</div><div style="margin-left: 3%;margin-top: 2%;" >'
										     +'<label class="col-sm-2 control-label" style="width: 20.6%;" >用户电话</label>'
										     +'<input type="text" style="width: 55%;" value="'+data.tel.substr(0, 3) + '****' + data.tel.substr(7)+'" placeholder="用户电话" disabled />'
									         +'</div><div style="margin-left: 3%;margin-top: 2%;" >'
										     +'<label class="col-sm-2 control-label" style="width: 20.6%;" >用户邮箱</label>'
										     +'<input type="text" style="width: 55%;" value="'+data.email.substr(0, 3) + '***' + data.email.substr(6)+'" placeholder="用户邮箱" disabled />'
									         +'</div><div style="margin-top: 3%;">'
										     +'<button type="button" class="btn btn-default" data-dismiss="modal" id="backShowUserWindowClose">Close</button>';
							    		if(data.state==3){
											str+='<a class="label label-primary" href="javascript:void(0)" onclick="changeUserState('+user+','+data.state+')" style="font-size: initial; float: right;">加入黑名单</a>';
										}else if(data.state==2){
											str+='<a class="label label-primary" href="javascript:void(0)" onclick="changeUserState('+user+','+data.state+')" style="font-size: initial; float: right;">通过</a>';
										}else if(data.state==1){
											str+='<a class="label label-primary" href="javascript:void(0)" onclick="changeUserState('+user+','+data.state+')" style="font-size: initial; float: right;">解禁</a>';
										}
										str+='</div>';
										$('#userDetilsWindow').html(str);
							    	 });
							     }
							</script>
							
							<!-- 分页查询 -->
						<nav style="margin-left: 65%;">
							<ul class="pagination pagination-lg">
								<!-- class='disabled'为选中了第一个或者最后一个的样式 -->
								<li th:if="${userList.pageNum eq 1}" class="disabled"><a href="javascript:void(0)" aria-label="Previous"><span aria-hidden="true">«</span></a></li>
								<li th:if="${userList.pageNum gt 1}" ><a href="javascript:void(0)" th:onclick="'toPage('+${userList.pageNum-1}+')'" aria-label="Previous"><span aria-hidden="true">«</span></a></li>
								<li th:if="${userList.pageNum-2 gt 0 }"><a href="javascript:void(0)" th:onclick="'toPage('+${userList.pageNum-2}+')'" th:text="${userList.pageNum-2}">1</a></li>
								<li th:if="${userList.pageNum-1 gt 0 }"><a href="javascript:void(0)" th:onclick="'toPage('+${userList.pageNum-1}+')'" th:text="${userList.pageNum-1}">2</a></li>
								<li class="active"><a href="javascript:void(0)" th:text="${userList.pageNum}">3</a></li><!-- 被选中 -->
								<li th:if="${userList.pageNum+1 le userList.pages}"><a href="javascript:void(0)" th:onclick="'toPage('+${userList.pageNum+1}+')'" th:text="${userList.pageNum+1}">4</a></li>
								<li th:if="${userList.pageNum+2 le userList.pages}"><a href="javascript:void(0)" th:onclick="'toPage('+${userList.pageNum+2}+')'" th:text="${userList.pageNum+2}">5</a></li>
								<li th:if="${userList.pageNum eq userList.pages}" class="disabled"><a href="javascript:void(0)"  aria-label="Next"><span aria-hidden="true">»</span></a></li>
								<li th:if="${userList.pageNum lt userList.pages}"><a href="javascript:void(0)" th:onclick="'toPage('+${userList.pageNum+1}+')'" aria-label="Next"><span aria-hidden="true">»</span></a></li>
							</ul>
						</nav>
						<!-- //分页查询 -->
					</div>	
						
						<div class="col-md-4 modal-grids">
							<div class="modal fade" id="gridSystemModal" tabindex="-1" role="dialog" aria-labelledby="gridSystemModalLabel">
								<div class="modal-dialog" role="document">
									<div class="modal-content">
										<div class="modal-header">
											<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
											<h4 class="modal-title" id="gridSystemModalLabel">用户信息</h4>
										</div>
										<div class="grid_3 grid_5 widget-shadow" style="margin-top: 0em;" id="userDetilsWindow">
											<!-- 显示一个即可 -->
											<div style="margin-left: 3%;">
												<img style="width: 236px; height: 70px;" src="ckeditor/plugins/about/dialogs/hidpi/logo_ckeditor.png" />
												<h4 style="display: inline-block;margin-left: 2%;" class="hdg" >用户名称</h4>
												<!-- 用户状态显示 根据用户实际状态显示   用户均可注册成为商家，均可登录，除了正常状态下均无法发布任何信息，或者与别人联络 -->
												<label class="label label-warning">申诉中</label>
												<label class="label label-success">正常</label>
												<label class="label label-danger">已被封禁</label>
												<!-- //用户状态显示 -->
											</div>
											<div style="margin-left: 3%;margin-top: 2%;" >
												<div id="addr-list" style="margin-bottom: 1%;">
													<label class="col-sm-2 control-label" style="width: 17.6%;" >用户地址</label>
													<div id="addr-list1">
														<span class="addr-num">1</span>.
														<input type="text" style="width: 55%;" value="湖南省衡阳市珠晖区衡花路18号" placeholder="用户地址" disabled />
													</div>
												</div>
												<a class="label label-info" id="addr-save" style="font-size: large;margin-left: 30%;display: none;" href="javascript:void(0)" onclick="saveAddr()">保存</a>
											</div>
											<div style="margin-left: 3%;margin-top: 2%;" >
												<label class="col-sm-2 control-label" style="width: 20.6%;" >用户电话</label>
												<input type="text" style="width: 55%;" value="176059348348" placeholder="用户电话" disabled />
											</div>
											<div style="margin-left: 3%;margin-top: 2%;" >
												<label class="col-sm-2 control-label" style="width: 20.6%;" >用户邮箱</label>
												<input type="text" style="width: 55%;" value="176059348348@qq.com" placeholder="用户邮箱" disabled />
											</div>
											<div style="margin-top: 3%;">
												<button type="button" class="btn btn-default" data-dismiss="modal" id="backShowUserWindowClose">Close</button>
												<!-- 这两个标签只显示一个 -->
												<a class="label label-primary" href="javascript:void(0)" onclick="" style="font-size: initial; float: right;">通过</a>
												<a class="label label-default" href="javascript:void(0)" onclick="" style="font-size: initial; float: right;">加入黑名单</a>
											</div>
											
										</div>
									</div><!-- /.modal-content -->
								</div><!-- /.modal-dialog -->
							</div><!-- /.modal -->
						</div>
					</div>
				</div>
			</div>
		</div>
		<!--footer-->
		<!--<div class="footer">
		   <p>Copyright &copy; 2016.Company name All rights reserved.<a target="_blank" href="http://sc.chinaz.com/moban/">&#x7F51;&#x9875;&#x6A21;&#x677F;</a></p>
		</div>-->
        <!--//footer-->
	</div>
	<!-- Classie -->
		<script src="js/classie.js"></script>
		<script>
			var menuLeft = document.getElementById( 'cbp-spmenu-s1' ),
				showLeftPush = document.getElementById( 'showLeftPush' ),
				body = document.body;
				
			showLeftPush.onclick = function() {
				classie.toggle( this, 'active' );
				classie.toggle( body, 'cbp-spmenu-push-toright' );
				classie.toggle( menuLeft, 'cbp-spmenu-open' );
				disableOther( 'showLeftPush' );
			};
			

			function disableOther( button ) {
				if( button !== 'showLeftPush' ) {
					classie.toggle( showLeftPush, 'disabled' );
				}
			}
		</script>
	<!--scrolling js-->
	<script src="js/jquery.nicescroll.js"></script>
	<script src="js/scripts.js"></script>
	<!--//scrolling js-->
	<!-- Bootstrap Core JavaScript -->
   <script src="js/bootstrap.js"> </script>
</body>
</html>